@import '../../../index.scss';

page {
  background-color: #f8f8f8;
}

.container {
  padding-bottom: 60rpx;

  .avatar {
    width: 160rpx;
    height: 160rpx;
    border-radius: 100%;
    overflow: hidden;
    margin: 40rpx auto 10rpx auto;

    image {
      width: 100%;
      height: 100%;
    }

  }

  .primary-id {
    text-align: center;
    font-size: 26rpx;
    color: #787878;
    // font-weight: bold;
  }

  .box {
    margin: 30rpx;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 30rpx;
    box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(0, 0, 0, 0.04);
    padding: 0 30rpx;

    .item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 1px solid #f8f8f8;
      padding: 30rpx 0rpx;

      &:last-child {
        border-bottom: none;
      }

      .title {
        font-size: 28rpx;
        font-weight: bold;
        color: #333;
      }

      .right {
        display: flex;
        align-items: center;

        .name {
          font-size: 26rpx;
          color: #787878;
        }

        .more {
          height: 32rpx;
          padding-left: 20rpx;
          margin-right: -10rpx;
          opacity: .4;
        }

      }
    }
  }
}